<template>
    <el-dialog v-model="show" title="审批" width="35%" align-center @close="handleClose">
        <el-form label-width="120px">
            <el-row :gutter="8">
                <el-col :span="12">
                    <el-form-item label="材料小类：">
                        {{ props.initList.paperTypeName }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="品名及规格：">
                        {{ props.initList.specifications }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="申请采购数量：">
                        {{ props.initList.applyPurchaseNumber }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="计划采购数量：">
                        {{ props.initList.planPurchaseNumber }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="采购单价：">
                        {{ props.initList.singlePrice }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="采购金额：">
                        {{ Number(props.initList.singlePrice) * Number(props.initList.planPurchaseNumber) }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="供应商：">
                        {{ props.initList.supplyName }}
                    </el-form-item>
                </el-col>

                <el-col :span="12">
                    <el-form-item label="需求到户日期：">
                        {{ props.initList.needArriveDate }}
                    </el-form-item>
                </el-col>

                <el-col :span="12">
                    <el-form-item label="备注：">
                        {{ props.initList.remark }}
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="审批备注：">
                        <el-input placeholder="请输入" v-model="approvalRemark" />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <template #footer>
            <div class="dialog-footer">
                <el-button @click="handleRefuse">拒 绝</el-button>
                <el-button type="primary" @click="handleSubmit">通 过</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { updatePaperPurchaseOrderApprovalApi } from '@/api/sj/purchaseManagement/paperProcurement/index';


const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const props = defineProps(['visible', 'initList']);
const emits = defineEmits(['submit', 'close']);

const show = ref(false);

watch(() => props.visible, async (newValue) => {
    show.value = newValue
    if (newValue) {
    }
}, { deep: true });

const approvalRemark = ref('');

const handleSubmit = async () => {
    approval(1);
};

const handleRefuse = async () => {
    approval(2);
};

// 审批
const approval = async (status: number) => {
    try {
        const { code } = await updatePaperPurchaseOrderApprovalApi({
            id: props.initList.id,
            status,
            approvalRemark: approvalRemark.value
        });

        if (code === 200) {
            proxy?.$modal.msgSuccess('操作成功');
            emits('submit', true);

            handleClose();
        }
    } catch (error) {

    }
};


const handleClose = () => {
    emits('close');
};

onMounted(() => {
})
</script>

<style lang="scss" scoped></style>